<template>
	<div style="height: 70vh; overflow-y: scroll; padding-right: 10px">
		<el-divider content-position="left">审批步骤</el-divider>
		<el-timeline>
			<el-timeline-item :timestamp="`审批人：${item.approverName}`" placement="top" v-for="item in approveRecord.examineRecords" :key="item.approverId"> </el-timeline-item>
		</el-timeline>
		<el-divider content-position="left">审批流程</el-divider>
		<el-timeline>
			<el-timeline-item color="#0bbd87" :timestamp="`审批人：${item.approverName}`" placement="top" v-for="item in approveRecord.workflowApprovalRecords" :key="item.id">
				<el-card>
					<div>
						<span>上报人：{{ item.informantName }}</span>
						<span :class="item.historyApproverFlag == '1' ? 'historyApprover' : ''">{{ item.historyApproverFlag == "1" ? "历史审批" : "" }}</span>
					</div>
					<p>审批时间：{{ item.approverTime }}</p>
					<p v-if="item.approverReason">审批理由：{{ item.approverReason }}</p>
				</el-card>
			</el-timeline-item>
		</el-timeline>
	</div>
</template>
<script>
export default {
	props: ["approveRecord"],
	data() {
		return { active: 1 }
	}
}
</script>
<style scoped lang="scss">
.historyApprover {
	border: 1px solid #eee;
	padding: 2px;
	margin-left: 20px;
	color: #ccc;
}
</style>
